@use "@/views/view.module.scss"as*;
@use "@/views/Chat/styles.module.scss"as *;

.chat_view_root {
  @extend .view_base;

  .chat_view {
    background-color: rgb(243, 243, 243);
    user-select     : none;
    overflow-y      : auto;
    overflow-x      : hidden;
    padding-bottom  : 50px;
    padding-bottom  : 50px;
    flex            : 1;
  }

  .empty {
    position  : absolute;
    top       : 50%;
    left      : 50%;
    transform : translate(-50%, -50%);
    transition: opacity 200ms;
  }

  .empty.empty_hidden {
    opacity: 0;
  }

  .bottom_box {
    display       : flex;
    flex-direction: column;
    align-items   : stretch;
  }

  .refer_box {
    background-color  : lightgray;
    color             : gray;
    font-size         : 12px;
    white-space       : pre-line;
    overflow          : hidden;
    word-break        : keep-all;
    margin            : 3px 0px;
    padding           : 3px 6px;
    border-radius     : 3px;
    align-self        : flex-start;
    display           : -webkit-box;
    /* autoprefixer   : ignore next */
    -webkit-line-clamp: 2; //多行在这里修改数字即可
    /* autoprefixer   : ignore next */
    -webkit-box-orient: vertical;
  }

  .refer_box_open {
    display           : inline-block;
    -webkit-line-clamp: unset; //多行在这里修改数字即可
    user-select       : text;
  }

  .refer_box_self {
    @extend .refer_box;
    align-self: flex-end;
  }
}